<template>
  <el-form
    ref="formRef"
    v-loading="loading"
    :model="formData"
    label-width="70px"
  >
    <el-row>
      <el-col :xl="8" :lg="8" :md="8" :sm="12" :xs="24">
        <el-form-item label="内部码" prop="internalCode " class="ml-10px mr-10px">
          <el-input v-model="formData.internalCode " clearable placeholder="内部码" @keyup.enter="focusInput"/>
        </el-form-item>
      </el-col>
      <el-col :xl="8" :lg="8" :md="8" :sm="12" :xs="24">
        <el-form-item label="成品码" prop="id" class="ml-10px mr-10px">
          <el-input v-model="formData.id" clearable placeholder="成品码" ref="productNode" @keyup.enter="getList"/>
        </el-form-item>
      </el-col>
      <!-- <el-col :xl="8" :lg="8" :md="8" :sm="12" :xs="24">
        <el-form-item label="成品名称" prop="name" class="ml-10px mr-10px">
          <el-input v-model="formData.name" clearable placeholder="成品名称"/>
        </el-form-item>
      </el-col> -->
    </el-row>
    <!-- <el-row>
      <el-col :xl="8" :lg="8" :md="8" :sm="12" :xs="24">
        <el-form-item label="" prop="boxScanMsg" class="ml-10px mr-10px">
          <div> {{ boxScanMsg }} </div>
        </el-form-item>
      </el-col>
    </el-row> -->
  </el-form>
  
</template>

<script lang="ts" setup>
  import * as boxScanningApi from '@/api/hcxly/boxScanning/Index'
  import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
import { handleError } from 'vue';

  defineOptions({ name: 'boxScanning' })

  const { wsCache } = useCache()
  const { t } = useI18n() // 国际化
  const message = useMessage() // 消息弹窗

  const loading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
  const formData = reactive({
    id: '',
    name: '',
    internalCode: ''
  })
  // const boxScanMsg = ref({})

  /** 扫码下线 */
  const getList = async () => {
    if(formData.id.length <= 0){
      return
    }
    loading.value = true
    try {
      // boxScanMsg.value = JSON.stringify(await boxScanningApi.updateBoxscan(formData))
      const { code, data, msg } = await boxScanningApi.updateBoxscan(formData)
      message.success('扫码下线成功，'+ msg)
      formData.id = ''
      formData.internalCode = ''
      
      // console.log(code)
      // console.log(data)
      if(code !== 0){
        message.error(msg)
      }

    } finally {
      loading.value = false
    }
  }

  // 创建一个引用，用于密码输入框元素
  const productNode = ref(null);
  /** 回车聚焦到下一个输入框 */
  const focusInput = () => {
    productNode.value.focus();
  }

</script>
